$form-color: scale-color(desaturate($base, 15%), $lightness: 91%)

// Login screen
.login
  background: url('../images/login/imac.png') 0 0 no-repeat
  background-size: 940px 778px
  color: $inverse
  margin-bottom: 77px
  padding: 38px 38px 267px
  position: relative

.login-screen
  background-color: $firm
  min-height: 317px
  padding: 123px 199px 33px 306px

.login-icon
  left: 200px
  position: absolute
  top: 160px
  width: 96px

  > img
    display: block
    margin-bottom: 6px
    width: 100%

  > h4
    font-size: 17px
    font-weight: 200
    line-height: 34px
    opacity: .95

    small
      color: inherit
      display: block
      font-size: inherit
      font-weight: 700

// Login form
.login-form
  background-color: $form-color
  border-radius: 6px
  padding: 24px 23px 20px
  position: relative

  // Ear
  &:before
    content: ''
    border-style: solid
    border-width: 12px 12px 12px 0
    border-color: transparent $form-color transparent transparent
    height: 0px
    position: absolute
    left: -12px
    top: 35px
    width: 0
    // Make corners smooth
    -webkit-transform: rotate(360deg)

  .control-group
    margin-bottom: 6px
    position: relative

  .login-field
    border-color: transparent
    font-size: 17px
    padding-bottom: 11px
    padding-top: 11px
    text-indent: 3px
    width: 299px
    &:focus
      & + .login-field-icon
        color: $firm

  .login-field-icon
    color: scale-color($gray, $lightness: 40%)
    font-size: 16px
    position: absolute
    right: 13px
    top: 14px
    +transition(.25s)

.login-link
  color: scale-color($gray, $lightness: 40%)
  display: block
  font-size: 13px
  margin-top: 15px
  text-align: center

// Serving 2x images
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (-moz-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 3/2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 2)
  .login
    background-image: url('../images/login/imac-2x.png')

